<template>
    <div>
        <el-table
                :data="tableData"
                ref="attentionTable"
                stripe
                border
                @selection-change="handleSelectionChange"
                style="width: 100%; margin-top: 10px;">
<!--            <el-table-column-->
<!--                    type="selection"-->
<!--                    fixed="left"-->
<!--                    width="40">-->
<!--            </el-table-column>-->
            <el-table-column
                    type="index"
                    label="序号"
                    width="50">
            </el-table-column>
            <el-table-column
                    prop="id"
                    label="ID">
            </el-table-column>
            <el-table-column
                    prop="number"
                    label="采集数量">
            </el-table-column>
            <el-table-column
                    prop="startTime"
                    label="开始时间">
            </el-table-column>
            <el-table-column
                    prop="status"
                    label="状态">
                <template  v-slot:default="slotProps">
                    <i style="font-size: 24px;" :title="statusKv[slotProps.row.status] && statusKv[slotProps.row.status].name" :class="[statusKv[slotProps.row.status] && statusKv[slotProps.row.status].icon, slotProps.row.status === 20 ? 'success-color':'', slotProps.row.status === 30 ? 'danger-color':'']"></i>
                </template>
            </el-table-column>
            <el-table-column
                    label="操作">
                <template  v-slot:default="slotProps">
                    <el-button type="success" plain size="mini" :disabled="slotProps.row.status != 20" @click="downLoad(slotProps.row)">下载</el-button>
                </template>
            </el-table-column>
        </el-table>
    </div>
</template>

<script>

  import { STATUS_KV } from '@/utils/constant'
  import { download } from '@/api/filtrate'

  export default {
    name: 'tableList',
    data() {
      return {
        statusKv: STATUS_KV
      }
    },
    props: {
      tableData: Array
    },
    mounted () {
      // eventBus.$off('restTable')
      // eventBus.$on('restTable', () => {
      //   if (this.$refs['attentionTable']) {
      //     this.$refs.attentionTable.clearSelection();
      //   }
      // })
    },
    methods: {
      // typeFormatter (row) {
      //   return STATUS_KV[row.status] || '-'
      // },
      handleSelectionChange (val) {
        this.$emit('select', val)
      },
      downLoad (row) {
        console.log(row)
        download({taskId: row.taskId})
      }
    }
  }
</script>

<style scoped>

    .success-color {
        color: #67C23A;
    }

    .danger-color {
        color: #F56C6C;
    }

</style>
